<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
    <meta name="description" content="">
    <meta name="author" content="">
    <link rel="icon" href="../favicon.ico">

    <title>易腾博客</title>

    <!-- Bootstrap core CSS -->
    {load href="/static/bootstrap/css/bootstrap.min.css" /}
    {load href="/static/swiper/swiper-3.4.2.min.css" /}
    <!--<link href="../../dist/css/bootstrap.min.css" rel="stylesheet">-->

    <!-- IE10 viewport hack for Surface/desktop Windows 8 bug -->
    <link href="../../assets/css/ie10-viewport-bug-workaround.css" rel="stylesheet">

    <!-- Custom styles for this template -->
    {load href="/static/css/blog.css" /}
    <!--<link href="blog.css" rel="stylesheet">-->

    <!-- Just for debugging purposes. Don't actually copy these 2 lines! -->
    <!--[if lt IE 9]><script src="../../assets/js/ie8-responsive-file-warning.js"></script><![endif]-->
    <script src="../../assets/js/ie-emulation-modes-warning.js"></script>

    <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
    <!--[if lt IE 9]>
    <script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
    <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
    <![endif]-->
</head>

<body>

<div class="blog-masthead">
    <div class="container">
        <nav class="blog-nav">
            <a class="blog-nav-item active" href="#">网站首页</a>
            <a class="blog-nav-item" href="#">我的博客</a>
            <a class="blog-nav-item" href="{:url('demo/index/index')}">作品展示</a>
            <a class="blog-nav-item" href="#">New hires</a>
            <a class="blog-nav-item" href="#">关于我</a>
        </nav>
    </div>
</div>







<div class="container">

    <div class="blog-header yt-header row">
        <div class="blog-header_swiper col-md-8">
            <div class="swiper-container">
                <div class="swiper-wrapper">
                    <div class="swiper-slide">
                        <img src="http://wx-12.oss-cn-shanghai.aliyuncs.com/tpy/art.jpg">

                    </div>

                </div>
                <!-- 如果需要分页器 -->
                <div class="swiper-pagination"></div>

                <!-- 如果需要导航按钮 -->
                <!--<div class="swiper-button-prev"></div>-->
                <!--<div class="swiper-button-next"></div>-->

                <!-- 如果需要滚动条 -->
                <!--<div class="swiper-scrollbar"></div>-->
            </div>
        </div>
        <div class="blog-header_intro col-md-4">
            <div class="card intro-box">
                <h3>我的名片</h3>
                <p>网名：易腾</p>
                <p>职业：Web前端开发、php初级</p>
                <p>QQ：1412428870</p>
                <p>Email：ytyjm@foxmail.com</p>

            </div>

            <!--<h1 class="blog-title">The Bootstrap Blog</h1>-->
            <!--<p class="lead blog-description">The official example template of creating a blog with Bootstrap.</p>-->
        </div>

    </div>

    <div class="row">

        <div class="col-md-8 blog-main">
<div class="blog-main_title">
    文章推荐
</div>


            <ul class="media-list ">
                <li class="media blog-item" style="">
                    <div class="col-sm-12 blog-item_title">我的博客1</div>
                    <div class="media-left col-sm-4 blog-item_img">
                        <a href="#">
                            <img class="media-object" src="http://wx-12.oss-cn-shanghai.aliyuncs.com/tpy/s1.jpg" alt="...">
                        </a>
                    </div>
                    <div class="media-body">
                        <p>
                            deno 是 V8 上的安全 TypeScript 运行时。

                            支持 TypeScript 2.8 开箱即用，使用 V8 6.8.275.3 引擎

                            无 package.json、npm，不追求兼容 Node

                            通过 URL 方式引入依赖而非通过本地模块，并在第一次运行的时候进行加载和缓存，并仅在代码使用--reload运行，依赖才会更新，引入方式如：
                        </p>
                    </div>
                    <div class="col-sm-12 media-ft">
                        <div class="col-sm-6 ta-l">
                            2013-12-12
                        </div>
                        <div class="col-sm-6 ta-r">
                            2013-12-12
                        </div>
                    </div>
                </li>

                <li class="media blog-item" style="">
                    <div class="col-sm-12 blog-item_title">我的博客1</div>
                    <div class="media-left col-sm-4 blog-item_img">
                        <a href="#">
                            <img class="media-object" src="http://wx-12.oss-cn-shanghai.aliyuncs.com/tpy/s1.jpg" alt="...">
                        </a>
                    </div>
                    <div class="media-body">
                        <p>
                            男人都是孩子，需要用一生时间来长大。女人都想当孩子，却最擅长的角色是妈妈。恋爱一开始，是两个孩子之间的游戏，到后来，成了大人和孩子之间的游戏。恋爱这回事，总要有一个人先长大，对另一半多些包容和宠溺。...
                        </p>
                    </div>
                    <div class="col-sm-12 media-ft">
                        <div class="col-sm-6 ta-l">
                            2013-12-12
                        </div>
                        <div class="col-sm-6 ta-r">
                            2013-12-12
                        </div>
                    </div>
                </li>
            </ul>






        </div><!-- /.blog-main -->





        <div class="col-md-3 col-md-offset-1 blog-sidebar">
            <div class="sidebar-module sidebar-module-inset">
                <h4>热门标签</h4>
                <div class="flex-container">
                    <div class="flex-item">PHP</div>
                    <div class="flex-item">HTML5</div>
                    <div class="flex-item">CSS3</div>
                    <div class="flex-item">WEB前端</div>

                </div>
            </div>

            <div class="list-group sidebar-module">
                <a href="#" class="list-group-item disabled">
                    推荐文章
                </a>
                <a href="#" class="list-group-item">Dapibus ac facilisis in</a>
                <a href="#" class="list-group-item">Morbi leo risus</a>
                <a href="#" class="list-group-item">Porta ac consectetur ac</a>
                <a href="#" class="list-group-item">Vestibulum at eros</a>
            </div>
            <div class="list-group sidebar-module">
                <a href="#" class="list-group-item disabled">
                    链接
                </a>
                <a href="#" class="list-group-item">GitHub</a>
                <a href="#" class="list-group-item">weibo</a>
                <a href="#" class="list-group-item">QQ</a>

            </div>
        </div><!-- /.blog-sidebar -->

    </div><!-- /.row -->

</div><!-- /.container -->

<footer class="blog-footer">
    <p>Blog template built for <a href="http://getbootstrap.com">Bootstrap</a> by <a href="https://twitter.com/mdo">@mdo</a>.</p>
    <p>
        <a href="#">Back to top</a>
    </p>
</footer>


<!-- Bootstrap core JavaScript
================================================== -->
<!-- Placed at the end of the document so the pages load faster -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script>window.jQuery || document.write('{load href="/static/jquery/js/jquery-3.2.1.min.js" /}')</script>


{load href="/static/bootstrap/js/bootstrap.min.js" /}
{load href="/static/swiper/swiper-3.4.2.jquery.min.js" /}

<script type="text/javascript">
    $(document).ready(function () {
        var mySwiper = new Swiper ('.swiper-container', {

            loop: true,

            // 如果需要分页器
            pagination: '.swiper-pagination',

            // 如果需要前进后退按钮
//            nextButton: '.swiper-button-next',
//            prevButton: '.swiper-button-prev',

            // 如果需要滚动条
//            scrollbar: '.swiper-scrollbar',
        })
    })
</script>



</body>
</html>
